import axios from 'axios'
import router from '@/router'
import { TOKEN } from '@/config/constants'
import { Message } from '@arco-design/web-vue'

const BASE_URL = import.meta.env.VITE_APP_BASE_API

// 导出Request，可以用来自定义传递配置来创建实例
export class Http {
  // axios 实例
  instance
  // 基础配置，url和超时时间
  baseConfig = { baseURL: BASE_URL, timeout: 60000 }

  constructor(config) {
    // 使用axios.create创建axios实例，配置为基础配置和我们传递进来的配置
    this.instance = axios.create(Object.assign(this.baseConfig, config))
    this.instance.interceptors.request.use(
      (config) => {
        // 一般会请求拦截里面加token，用于后端的验证
        const token = localStorage.getItem(TOKEN)
        if (token) {
          config.headers['Authorization'] = token
        }
        return config
      },
      (err) => {
        // 请求错误，这里可以用全局提示框进行提示
        return Promise.reject(err)
      }
    )

    this.instance.interceptors.response.use(
      (res) => {
        // 直接返回res，当然你也可以只返回res.data
        // 系统如果有自定义code也可以在这里处理
        if (res.data.code && res.data.code !== 200) {
          Message.error(res.data.message)
          return Promise.reject()
        }
        return res.data
      },
      async (err) => {
        // 这里用来处理http常见错误，进行全局提示
        let message = ''
        //网络超时异常处理
        if (
          err.code === 'ECONNABORTED' ||
          err.message === 'Network Error' ||
          err.message.includes('timeout')
        ) {
          message = '请求超时'
        } else {
          switch (err.response.status) {
            case 400:
              message = '请求错误(400)'
              break
            case 401:
              message = err.response.data.message || '未授权，请重新登录(401)'
              router.replace('/login')
              localStorage.removeItem(TOKEN)
              break
            case 403:
              router.replace('/login')
              localStorage.removeItem(TOKEN)
              message = '拒绝访问(403)'
              break
            case 404:
              message = '请求出错(404)'
              break
            case 408:
              message = '请求超时(408)'
              break
            case 500:
              message = err.response.data.message || '服务器错误(500)'
              break
            case 501:
              message = '服务未实现(501)'
              break
            case 502:
              message = '网络错误(502)'
              break
            case 503:
              message = '服务不可用(503)'
              break
            case 504:
              message = '网络超时(504)'
              break
            case 505:
              message = 'HTTP版本不受支持(505)'
              break
            default:
              message = `连接出错(${err.response.status})!`
              Message.error(message)
          }
        }

        // // 这里错误消息可以使用全局弹框展示出来
        // // 比如element plus 可以使用 ElMessage
        // ElMessage({
        //     showClose: true,
        //     message: `${message}，请检查网络或联系管理员！`,
        //     type: "error",
        // });
        // 这里是AxiosError类型，所以一般我们只reject我们需要的响应即可
        return Promise.reject(err.response)
      }
    )
  }

  // 定义请求方法
  request(config) {
    return this.instance.request(config)
  }

  get(url, params, config) {
    return this.instance.get(url, { params }, config)
  }

  post(url, data, config) {
    return this.instance.post(url, data, config)
  }

  put(url, data, config) {
    return this.instance.put(url, data, config)
  }

  delete(url, params, config) {
    return this.instance.delete(url, { params }, config)
  }
}

// 默认导出Request实例
export default new Http({})
